(function(win, doc) {

	let browser_data = win.localStorage;

	let todo_data = new Array();
	if (browser_data['todo_data'] != undefined) {
		//todo_data = browser_data['todo_data'].split(',');
		todo_data = resave();
	}

	console.log('1212',todo_data)


	
	let todo_status = new Array();
	if (browser_data['todo_status'] != undefined) {
		todo_status = browser_data['todo_status'].split(',');
	}
	console.log(todo_data)
	let todo_total = todo_data.length - 1;
	if (todo_total < 0) {
		todo_total = 0;
	}
	console.log(todo_total)

	let todo_false = -1;
	for (let i in todo_status) {
		if (todo_status[i] == 0) todo_false++;
	}
	browser_data['todo_false'] = todo_false;
	browser_data['todo_total'] = todo_total;
	let list_type = parseInt(browser_data['list_type']);
	if (isNaN(list_type))
		list_type = 1;
	myinit();
	myulinit();
	myfooterclick();


	doc.onkeydown = function(event) {
		let e = event || window.event || arguments.callee.caller.argumnets[0];
		if (e && e.keyCode == 13) {
			let todoinfo = eval(doc.getElementById("todoinfo")).value;
			eval(doc.getElementById("todoinfo")).value = "";
			if (todoinfo)
				addlist(todoinfo);
		}
	}


	function myinit() {
		if (!(todo_data == undefined || todo_data.length == 0)) {
			getlist();
		}
	}

	function myulinit() {
		let x;
		let ul_circle = doc.getElementsByClassName("circle");
		for (x in ul_circle) {
			myforeach1(ul_circle[x], x);
		}
		let ul_cont = doc.getElementsByClassName("list-li-cont");
		for (x in ul_cont) {
			myforeach2(ul_cont, x);
		}

		let check_all = doc.getElementsByClassName("check-all");
		check_all[0].onclick = function() {
			checked_all(ul_circle, ul_cont, this);
		}

		let ul_cont_i = doc.getElementsByClassName("list-li-cont-i");
		for (x in ul_cont_i) {
			console.log('wwww',ul_cont_i[x])
			myforeach3(ul_cont_i[x], x);
		}
	}

	function checked_all(ul_circle, ul_cont, that) {
		let check_cname = that.className;
		let f = false;
		console.log('1', todo_status, equ0(todo_status), check_cname.includes("checked"),todo_status.includes(0))

		if (  equ1(todo_status)   || check_cname.includes("checked")) {
			f = true;
			todo_false = todo_total;
			that.className = "w40 check-all";
		} else {
			that.className = "w40 check-all checked";
			todo_false = 0;
		}
		if ( !todo_status.includes(0) ) {
			f = true;
			todo_false = todo_total;
			that.className = "w40 check-all";

		} 
		if ( equ0(todo_status) ){
			f = false;
			that.className = "w40 check-all checked";
			todo_false = 0;
		}
		browser_data['todo_false'] = todo_false;

		let x;
		for (x in ul_circle) {
			let x_int = parseInt(x);
			let array_that = ul_circle[x];
			console.log('2', ul_cont[x].className);
			if (f) {
				array_that.className = "circle";
				todo_status[todo_total - x_int] = 0;
				ul_cont[x].className = "list-li-cont";

			} else {
				array_that.className = "circle circle-check";
				todo_status[todo_total - x_int] = 1;
				ul_cont[x].className = "list-li-cont cont-checked";
			}
			//console.log(f,todo_status,x_int)
		}
		browser_data['todo_status'] = todo_status;
		console.log(f, todo_status)

		getlist();
		myinit();
	}

	function equ1(val) {
		for (let i = 1; i < val.length; i++) {
			if (val[i] != 1) return false;
		}
		return true;
	}

	function equ0(val) {
		console.log('212121',val);
		for (let i = 1; i < val.length; i++) {
			console.log(val[i],0)
			if (val[i] != 0) return false;
		}
		return true;
	}

	function myforeach1(item, x) {
		console.log('opppp');
		item.onclick = function() {
			let that = this;
			let x_int = parseInt(x);

			cleanWhiteSpace(that.parentNode);
			let cname = that.className;
			let cont = that.nextSibling;
			//console.log('op',todo_total-x_int);
			if (cname.includes("circle-check")) {
				that.className = "circle";
				cont.className = "list-li-cont";
				todo_false++;
				todo_status[todo_total - x_int] = 0;
			} else {
				that.className = "circle circle-check";
				cont.className = "list-li-cont cont-checked";
				todo_false--;
				todo_status[todo_total - x_int] = 1;

			}
			doc.getElementsByClassName("check-all")[0].className = "w40 check-all";
			browser_data['todo_false'] = todo_false;
			upulfooter();
			myinit();
		}
	}

	function myforeach2(item, index) {

		item[index].ondblclick = function() {

			for( let i in item ){
				if( i != index ) {
					item[i].ondblclick=function(){
						return false;
					}
				}
			}

			let tp = doc.getElementsByClassName('list-ul')[0];

			let that = this;

			let parent = this.parentNode;
			let parent_html = parent.innerHTML;
			let li = doc.createElement("li");
			li.className = "list-editor";
			let html = '<input type="text" name="editor" id="editor" value="' + this.firstChild.innerHTML + '" />';
			li.innerHTML = html;
			let ul = doc.getElementById("list-ul");
			cleanWhiteSpace(ul);
			let newnodeparent = doc.createElement('ul');
			newnodeparent.innerHTML = getulfooter();
			let newnode = newnodeparent.firstChild;
			let tmp_old = ul.childNodes[parseInt(index)].innerHTML;
			ul.replaceChild(li, ul.childNodes[index]);

			console.log(112, ul)
			console.log(112, li)

			let edit = doc.getElementById("editor");
			edit.onblur = function() {
				console.log('1',edit)
				let val = eval(this).value
				let p = this.parentNode;
				if( val == "" || val == undefined ) {
					if( todo_status[todo_total - parseInt(index)]  == 0 ){
						todo_false--;
					}
					todo_status.splice(todo_total - parseInt(index),1);
					todo_data.splice(todo_total - parseInt(index),1);
					todo_total--;
				}
				else{
					let myli = doc.createElement("li");
					myli.innerHTML = tmp_old;
					//console.log('mye',myli.firstChild.firstChild.firstChild.childNodes[1].firstChild)
					myli.firstChild.firstChild.firstChild.childNodes[1].firstChild.innerHTML = val;
					ul.replaceChild(myli, this.parentNode);
					//console.log(ul);
					todo_data[todo_total - parseInt(index)] = '<li>' + myli.innerHTML + '</li>';
				}
				
				browser_data['todo_status'] = todo_status;
				save(todo_data);
				//browser_data['todo_data'] = todo_data;
				browser_data['todo_total'] = todo_total;
				browser_data['todo_false'] = todo_false;
				myinit();
				//myulinit();
			}
			edit.onkeydown = function(event) {
				
				let e = event || window.event || arguments.callee.caller.argumnets[0];
				if (e && e.keyCode == 13) {
					this.onblur = function(){
						return false;
					}
					let val = eval(this).value
					let p = this.parentNode;
					if( val == "" || val == undefined ) {
						if( todo_status[todo_total - parseInt(index)]  == 0 ){
							todo_false--;
						}
						todo_status.splice(todo_total - parseInt(index),1);
						todo_data.splice(todo_total - parseInt(index),1);
						todo_total--;
					}
					else {
						console.log('myk', this.parentNode);
						let myli = doc.createElement("li");
						myli.innerHTML = tmp_old;
						console.log('mye', myli.firstChild.firstChild.firstChild.childNodes[1].firstChild)
						myli.firstChild.firstChild.firstChild.childNodes[1].firstChild.innerHTML = val;
						console.log('111', todo_data)
						ul.replaceChild(myli, this.parentNode);
						console.log(ul);
						todo_data[todo_total - parseInt(index)] = '<li>' + myli.innerHTML + '</li>';
					}

					browser_data['todo_status'] = todo_status;
					//browser_data['todo_data'] = todo_data;
					save(todo_data);
					browser_data['todo_total'] = todo_total;
					browser_data['todo_false'] = todo_false;
					//getlist();
					myinit();
					//myulinit();
				}
			}
			
		}

		item[index].onmouseover = function() {
			cleanWhiteSpace(this.parentNode);
			let li_del = this.parentNode.childNodes[2];
			li_del.childNodes[1].style.display = "block";
		}
		item[index].onmouseout = function() {
			cleanWhiteSpace(this.parentNode);
			let li_del = this.parentNode.childNodes[2];
			li_del.childNodes[1].style.display = "none";
		}
	}

	function myforeach3(item, index) {

		item.onmouseover = function() {
			let li_del = this;
			li_del.childNodes[1].style.display = "block";
		}
		item.onmouseout = function() {
			let li_del = this;
			li_del.childNodes[1].style.display = "none";
		}
		item.onclick = function() {
			let mydel = parseInt(todo_total) - parseInt(index);

			//.log(':total',parseInt(todo_total),':index',parseInt(index),':del',mydel,todo_status[mydel],todo_data[mydel]);
			if (todo_status[parseInt(mydel)] == 0) todo_false--;
			todo_status.splice(parseInt(mydel), 1);
			todo_data.splice(parseInt(mydel), 1);
			todo_total--;
			//console.log(2,todo_data);
			//console.log(2,todo_status);
			browser_data['todo_status'] = todo_status;
			//browser_data['todo_data'] = todo_data;
			save(todo_data);
			browser_data['todo_total'] = todo_total;
			browser_data['todo_false'] = todo_false;
			//getlist();
			myinit();
		}
	}

	function addlist(todoinfo) {
		let ul = doc.getElementById("list-ul");
		let li_cont = '<li>' +
			'<table>' +
			'<tr>' +
			'<td class="circle"><span> <i>√</i>  </span></td>' +
			'<td class="list-li-cont">' +
			'<span>' + todoinfo + '</span>' +
			'</td>' +
			'<td class="list-li-cont-i"> <i >×</i>  </td>' +
			'</tr>' +
			'</table>' +
			'</li>';
		todo_data = new Array();
		if (browser_data['todo_data'] != undefined) {
			//todo_data = browser_data['todo_data'].split(',');
			todo_data = resave(todo_data);
		}
		if( todo_data.length == 0 ) {
			todo_data.unshift("");
		}
		todo_status = new Array();
		if (browser_data['todo_status'] != undefined) {
			todo_status = browser_data['todo_status'].split(',');
		}
		todo_data.push(li_cont);
		todo_status.push(0);

		console.log('qp', todo_data);
		todo_total = todo_data.length -1;
		todo_false++;
		//browser_data['todo_data'] = todo_data;
		save(todo_data);
		browser_data['todo_status'] = todo_status;
		browser_data['todo_total'] = todo_total;
		browser_data['todo_false'] = todo_false;
		let html = ul.innerHTML;
		if( ul.childNodes.length == 0 ) {

		}
		//if (list_type != 3) 
		{
			doc.getElementById("list-ul").innerHTML = li_cont + html;
		}
		upulfooter();
		getlist();
		
		//myulinit();
	}


	function getlist() {
		let data = todo_data;
		let html = "";
		console.log(11, data)
		console.log(11, todo_status)
		for (let x in data) { 
			if (data[x] != " ")
				html = data[x] + html;
		}
		if (html != "" || list_type != 1)
			html += getulfooter();
		let ul = doc.getElementById("list-ul");
		ul.innerHTML = html;
		for (let x = ul.childNodes.length - 2; x >= 0; x--) {
			let x_int = todo_total - parseInt(x);
			console.log('getlist', todo_total, x, x_int, todo_status[x_int], list_type)
			console.log(ul.childNodes);
			ul.childNodes[x].style.display = "none";
			console.log('ceshi',ul.childNodes[x]);
			if (list_type == 1) {
				ul.childNodes[x].style.display = "block";
			}
			if (list_type == 2) {
				if (todo_status[x_int] == 0) {
					ul.childNodes[x].style.display = "block";
				}
			}
			if (list_type == 3) {
				if (todo_status[x_int] == 1) {
					ul.childNodes[x].style.display = "block";
				}
			}
		}
		getcheck();
		myulinit();
		upulfooter();
	}

	function getcheck() {

		let ul_circle = doc.getElementsByClassName("circle");
		let ul_cont = doc.getElementsByClassName("list-li-cont");
		let tmp = 1;
		for (let x = ul_circle.length - 1; x >= 0; x--) {

			let array_that = ul_circle[x];
			let array_cont = ul_cont[x];
			let x_int = todo_total - parseInt(x);
			console.log('getcheck', todo_total, x, x_int, todo_status[x_int], list_type)
			if (list_type == 2 || todo_status[x_int] == 0) {
				array_that.className = "circle";
				array_contclassName = "list-li-cont";
			}
			if (list_type == 3 || todo_status[x_int] == 1) {
				array_that.className = "circle circle-check";
				array_cont.className = "list-li-cont cont-checked";
			}
		}
		myfooterclick()

	}

	function upulfooter() {

		browser_data['todo_status'] = todo_status;
		let ul = doc.getElementById("list-ul");
		cleanWhiteSpace(ul);
		let newnodeparent = doc.createElement('ul');
		newnodeparent.innerHTML = getulfooter();
		let newnode = newnodeparent.firstChild;
		if (ul.childNodes.length <= 1 && list_type == 1 ) {
			ul.appendChild(newnode);
		} else {
			if( ul.childNodes.length != 0 )
			ul.replaceChild(newnode, ul.lastChild);
		}
		if (ul.childNodes.length == 1 ){
			ul.innerHTML="";
		}
		myfooterclick()

	}

	function getulfooter() {
		let sp1 = '<span id="all"> All </span>';
		let sp2 = '<span id="active"> Active </span>';
		let sp3 = '<span id="completed"> Completed </span>';
		if (list_type == 1) sp1 = '<span id="all" class="sp2-checked"> All </span>';
		if (list_type == 2) sp2 = '<span id="active" class="sp2-checked"> Active </span>';
		if (list_type == 3) sp3 = '<span id="completed" class="sp2-checked"> Completed </span>';

		let html = '<li class="list-footer">' +
			'<span class="sp1"> ' + todo_false + ' items left </span>' +
			'<span class="sp2"> ' + sp1 + sp2 + sp3 + '</span>' +
			'<span class="sp3" id="clear" > Clear completed</span>' +
			'</li>';
		return html;
	}

	function myfooterclick() {

		let myall = doc.getElementById("all");
		if (myall) {
			myall.onclick = function() {
				list_type = 1;
				browser_data['list_type'] = list_type;
				//console.log(todo_data);
				myinit();
			}
		}
		let active = doc.getElementById("active");
		if (active) {
			active.onclick = function() {
				list_type = 2;
				browser_data['list_type'] = list_type;
				myinit();
			}
		}

		let completed = doc.getElementById("completed");
		if (completed) {
			completed.onclick = function() {
				list_type = 3;
				browser_data['list_type'] = list_type;
				myinit();
			}
		}


		let clear = doc.getElementById("clear");
		if (clear) {
			if (parseInt(todo_false) == parseInt(todo_total)) {
				clear.className = "sp31";
				clear.innerHTML = "&nbsp;";
				//console.log(clear)	
			} else {
				clear.className = "sp3";
			}
			clear.onclick = function() {

				let mydel = new Array();
				let tmp = 0;
				console.log(todo_status);
				for (let x in todo_status) {
					if (todo_status[x] == 1) {
						mydel.push((parseInt(x) - tmp));
						console.log('mydel', x, todo_total, tmp);
						tmp++;
					}
				}
				console.log('del', mydel);
				for (let i = 0; i < mydel.length; i++) {
					todo_total--;
					todo_status.splice(parseInt(mydel[i]), 1);
					todo_data.splice(parseInt(mydel[i]), 1);
					//console.log(mydel[i]);
				}
				console.log(2, todo_data);
				// console.log(2,todo_status);
				browser_data['todo_status'] = todo_status;
				//browser_data['todo_data'] = todo_data;
				save(todo_data);
				browser_data['todo_total'] = todo_total;
				getlist();
				myinit();
				upulfooter();
				
			}
		}

	}

	function cleanWhiteSpace(rootElement) {
		let i;
		if (rootElement.hasChildNodes())
			for (i = 0; i < rootElement.childNodes.length; i++) {
				let node = rootElement.childNodes[i];
				if (node.nodeType == 3) {
					node.parentNode.removeChild(node);
				}

			}
	}
	function save( todo_data ) {
		let jsontodo = JSON.stringify(todo_data);
		browser_data['todo_data'] = jsontodo;
	}
	function resave(){
		let jsontodo = browser_data['todo_data'];
		let tmp;
		if(jsontodo == undefined || jsontodo == "" ) {
			tmp = new Array();
		}else {
			tmp = JSON.parse(jsontodo);
		}
		console.log(tmp)
		return tmp;
	}


})(window, document);